import type { FC } from 'react';
import { Svg, Text as SvgText } from 'react-native-svg';
import type { HollowTextProps } from './types';

const HollowText: FC<HollowTextProps> = (props) => {
  const {
    color = '#fff',
    fontSize = 14,
    strokeWidth = 1,
    fontWeight = 'bold'
  } = props;
  
  return (
    <Svg>
      <SvgText
        x="50%"
        y="50%"
        fill="none"
        stroke={color}
        textAnchor="middle"
        fontSize={fontSize}
        strokeWidth={strokeWidth}
        fontWeight={fontWeight}
      >
        {props.children}
      </SvgText>
    </Svg>
  );
}

export default HollowText;